<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>充值</title>

	<%-- 静态包含 base标签、css样式、jQuery文件 --%>
	<style>
		body {
			overflow: hidden;
		}

		* {
			margin: 0;
			font-family:"Microsoft Yahei";
			color: #666;
		}

		div{
			margin: auto;
			margin-bottom: 10px;
			margin-top: 10px;

		}

		#header {
			height: 82px;
			width: 1200px;
		}

		#main {
			height: 460px;
			width: 1200px;
			border: 1px black solid;
			overflow: auto;
		}

		#bottom {
			height: 30px;
			width: 1200px;
			text-align: center;
		}

		#book{
			width: 100%;
			height: 90%;
			margin: auto;

		}

		.b_list{
			height:300px;
			width:250px;
			margin: 20px;
			float: left;
			margin-top:0px;
			margin-bottom:0px;
			border: 1px #e3e3e3 solid;
		}

		#page_nav{
			width: 100%;
			height: 10px;
			margin: auto;

			text-align: center;
		}

		#pn_input {
			width: 30px;
			text-align: center;
		}

		.img_div{
			height: 150px;
			text-align: center;
		}

		.book_img {
			height:150px;
			width:150px;
		}

		.book_info {

			text-align: center;
		}

		.book_info div{
			height: 10px;
			width: 300px;
			text-align: left;
		}

		.wel_word{
			font-size: 60px;
			float: left;
		}

		.logo_img{
			float: left;
		}

		#header div a {
			text-decoration: none;
			font-size: 20px;
		}

		#header div{
			float: right;
			margin-top: 55px;
		}

		.book_cond{
			margin-left: 500px;
		}

		.book_cond input{
			width: 50px;
			text-align: center;
		}


		/*登录页面CSS样式  */

		#login_header{
			height: 82px;
			width: 1200px;
		}

		.login_banner{
			height:475px;
			background-color: #39987c;
		}

		.login_form{
			height:310px;
			width:406px;
			float: right;
			margin-right:50px;
			margin-top: 50px;
			background-color: #fff;
		}

		#content {
			height: 475px;
			width: 1200px;
		}

		.login_box{
			margin: 20px;
			height: 260px;
			width: 366px;
		}

		h1 {
			font-size: 20px;
		}
		.msg_cont{
			background: none repeat scroll 0 0 #fff6d2;
			border: 1px solid #ffe57d;
			color: #666;
			height: 18px;
			line-height: 18px;
			padding: 3px 10px 3px 40px;
			position: relative;
			border: none;
		}


		.form .itxt {
			border: 0 none;
			float: none;
			font-family: "宋体";
			font-size: 14px;
			height: 18px;
			line-height: 18px;
			overflow: hidden;
			padding: 10px 0 10px 10px;
			width: 220px;
			border: 1px #e3e3e3 solid;
		}

		#sub_btn{
			background-color: #39987c;
			border: none;
			color: #fff;
			width: 360px;
			height: 40px;
		}

		#l_content {
			float: left;
			margin-top: 150px;
			margin-left: 300px;
		}

		#l_content span {
			font-size: 60px;
			color: white;
		}

		.tit h1 {
			float: left;
			margin-top: 5px;
		}

		.tit a {
			float: right;
			margin-left: 10px;
			margin-top: 10px;
			color: red;
			text-decoration: none;
		}

		.tit .errorMsg {
			float: right;
			margin-left: 10px;
			margin-top: 10px;
			color: red;
		}

		.tit {
			height: 30px;
		}
		/*购物车*/
		#main table{
			margin: auto;
			margin-top: 80px;
			border-collapse: collapse;
		}

		#main table td{
			width: 120px;
			text-align:center;
			border-bottom: 1px #e3e3e3 solid;
			padding: 10px;
		}

		.cart_info{
			width: 700px;
			text-align: right;
		}

		.cart_span {
			margin-left: 20px;
		}

		.cart_span span{
			color: red;
			font-size: 20px;
			margin: 10px;
		}

		.cart_span a , td a{
			font-size: 20px;
			color: blue;
		}

		#header div span {
			margin: 10px;
		}

		#header div .um_span{
			color: red;
			font-size: 25px;
			margin: 10px;
		}

		#header div a {
			color: blue;
		}

	</style>
	<script src="../../static/js/jquery-1.11.0.js "></script>
	<script>
		$(function(){

			$("#card").blur(function () {
				/*$("#password2").css("border-color","gray");*/
				const value = $("#card").val();
				location.href="/centerServlet?action=findMoney&cardnumber="+value;
			})

			$("#code_img").click(function () {
				this.src = "/kaptcha.jpg?date="+new Date().getTime();
			})
			$("#btn").click(function (){
				location.href="/index.jsp"
			})
		})

	</script>

	<style>

		#content{
			position: relative;
			top: 20px;
			right: 340px;
		}
		#sub_btn{
			height: 50px;
			width: 220px;
			background: #2E58FF;
			border-radius: 50px;
			outline: none;
			color: white;
			border: none;
			font-size: 16px;
			margin-left: 72px;
			margin-top: 30px;
			position: relative;
			bottom: 80px;
		}
		#ss1{
			position: relative;
			left: 200px;
		}
		#aa{
			height:410px;
		}
	</style>
</head>
<body>
<div class="login_banner">
				<div id="content">
					<div class="login_form" id="aa">
						<div class="login_box">
							<span style="font-size: 30px">充值</span>
							<input type="button" value="返回首页" style="position: relative; left: 220px" id="btn">
							<div class="msg_cont">
								<b></b>
								<span class="errorMsg">
									${empty msg ? "请选择银行卡及充值金额":msg }
								</span>
							</div>
							<div class="form">
								<form action="/centerServlet" method="post">
									<input type="hidden" name="action" value="recharge" />
									<label>选择银行卡:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</label>
									<input class="itxt" type="text" id="card" placeholder=""
										   autocomplete="off" tabindex="1" name="cardnumber"
										   value="${cardnumber}" />
									<br />
									<span id="ss1" style="color: red" class="errorMsg">
										余额:${yu_e }
									</span>
									<br />
									<label>输入充值金额:￥</label>
									<input class="itxt" type="text"
										   autocomplete="off" tabindex="1" name="money" value="${money}"/>
									<br />
									<br />
									<label>支付密码:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</label>
									<input class="itxt" type="password" placeholder="请输入支付密码"
										   autocomplete="off" tabindex="1" name="password" />
									<br />
									<br />
									<label>验证码:&nbsp&nbsp&nbsp&nbsp&nbsp</label>
									<input class="itxt" type="text" name="code" style="width: 150px;" id="code" />
									<img id="code_img" alt="" src="/kaptcha.jpg" style="float: right; margin-right: 15px;width: 90px;height: 40px;">
									<br />
									<br />
									<br />
									<br />
									<input type="submit" value="确定充值" id="sub_btn" />
								</form>
							</div>
							
						</div>
					</div>
				</div>
</div>

		<%--静态包含页脚内容--%>
		<%@include file="/pages/common/footer.jsp"%>
</body>
</html>